<template>
 <el-main>
  <div class="menmuTitle"><h1>{{ $t('user.setting.title') }}</h1></div>

  <real-name></real-name>

  <reset></reset>

  <payment></payment>

  <avatars></avatars>
 </el-main>
</template>

<script>
import RealName from "@/views/User/Settings/RealName/RealName";  // Real name authentication
import Reset from "@/views/User/Settings/Reset/Reset";  // 修改密码
import Avatars from "@/views/User/Settings/Avatar/Avatar";  // 上传头像
import Payment from "@/views/User/Settings/Payment/Payment";  // 设置交易密码

export default {
 name: "Settings",
 components: {
  Payment,
  RealName,
  Reset,
  Avatars
 }
}
</script>

<style scoped lang="scss">
.el-main {
 .menmuTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;

  h1 {
   font-size: 20px;
   font-weight: bold;
   color: #002445;
   position: relative;
   padding-bottom: 10px;

   &:after {
    display: block;
    content: "";
    width: 140px;
    height: 2px;
    background: #0d4fa5;
    position: absolute;
    bottom: 0;
    left: 0;
    border-radius: 4px;
   }
  }
 }
}
</style>
